<template>
  <BasicModal
    v-bind="$attrs"
    :title="props.title"
    @register="registerModal"
    width="700px"
    @ok="handleSubmit"
    @cancel="closeFunc"
  >
    <PageWrapper>
      <BasicForm
        @register="register"
        :showSubmitButton="false"
        :model="modelRef"
        :showResetButton="false"
      />
    </PageWrapper>
  </BasicModal>
</template>
<script lang="ts" setup>
  import { ref } from 'vue';
  import { BasicModal, useModalInner } from '@/components/Modal';
  import { PageWrapper } from '@/components/Page';
  import { BasicForm, useForm } from '@/components/Form';
  import { useMessage } from '@/hooks/web/useMessage';
  import { destinationFormSchemas } from './AddContract';
  import { addFreightInfo, batchUpdate } from '@/api/eslogis-tps/index';
  import { message } from 'ant-design-vue';

  const emit = defineEmits(['onSearch']);
  const props = defineProps({
    title: {
      type: String,
      default: '',
    },
  });
  const modelRef = ref({});
  const type = ref('');
  const { createMessage } = useMessage();

  const queryParams = ref();

  const oldParams = ref();

  // const initParams = () => {
  //   queryParams.value = {
  //     freightTypeId: '',
  //     contractId: '',
  //     carrierMid: '',
  //     ownerMid: '',
  //     leastWeight: 0,
  //     maxWeight: 0,
  //   };
  // };

  const [registerModal, { closeModal }] = useModalInner((data) => {
    data && onDataReceive(data);
  });
  function onDataReceive(data) {
    type.value = data.type;
    queryParams.value = {
      freightTypeId: data.freightTypeId,
      freightType: data.freightType,
      contractId: data.contractId,
      carrierMid: data.carrierMid,
      ownerMid: data.ownerMid,
      maxWeight: 0,
      leastWeight: 0,
      fixedPrice: 0,
      tonPrice: 0,
      transportPrice: 0,
      deliverPrice: 0,
      charteredPrice: 0,
    };

    if (data.type === 'edit') {
      oldParams.value = {
        oldOriginCode: data.originCode,
        oldDestCode: data.destCode,
      };
      setFieldsValue({
        originArea: data.originArea,
        originCode: data.originCode,
        destArea: data.destArea,
        destCode: data.destCode,

        originCity: data.originCity,
        originCounty: data.originCounty,
        originProvince: data.originProvince,
        destCity: data.destCity,
        destCounty: data.destCounty,
        destProvince: data.destProvince,
      });
    }
  }

  const [register, { validate, setFieldsValue, resetFields }] = useForm({
    layout: 'vertical',
    baseColProps: {
      span: 6,
    },
    schemas: destinationFormSchemas,
    // showActionButtonGroup: false,
  });

  function closeFunc() {
    console.log('===================closeFunc', type.value);
    type.value = '';
    resetFields();
  }
  async function handleSubmit() {
    try {
      const [values] = await Promise.all([validate()]);
      console.log('form data:', values);
      let params = { ...values, ...queryParams.value };
      console.log('values', type.value);
      const updateOraddAPI = type.value === 'edit' ? batchUpdate : addFreightInfo;
      if (type.value === 'edit') {
        params = {
          ...params,
          ...oldParams.value,

          originCode: values.originCode,
          destCode: values.destCode,
          originCity: values.originCity,
          originCounty: values.originCounty,
          originProvince: values.originProvince,
          destCity: values.destCity,
          destCounty: values.destCounty,
          destProvince: values.destProvince,

          newOriginProvince: values.originProvince,
          newOriginCity: values.originCity,
          newOriginCounty: values.originCounty,
          newOriginCode: values.originCode,

          newDestProvince: values.destProvince,
          newDestCity: values.destCity,
          newDestCode: values.destCode,
          newDestCounty: values.destCounty,
        };
      }
      updateOraddAPI(params).then((res) => {
        console.log(res);

        createMessage.success('处理成功');
        resetFields();
        closeModal();
        type.value = '';
        emit('onSearch');
      });
    } catch (error) {
      console.log(error);
      if (error.errorFields && error.errorFields.length > 0) {
        message.error('请选择城市');
      }
    }
  }
</script>
